<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="styles/layout.css" type="text/css" />
<!-- -->
<script type="text/javascript" src="scripts/jquery.slidepanel.setup.js"></script>



<link rel="stylesheet" href="styles/pagination/style.css" />
<link rel="stylesheet" href="styles/pagination/jPages.css" />
<link rel="stylesheet" href="styles/pagination/animate.css" />
<link rel="stylesheet" href="styles/pagination/github.css" />
<script src="scripts/pagination/jquery-1.7.1.min.js"></script>
<!-- 1.4.1版本貌似不支持这个分页 -->
<script src="scripts/pagination/tabifier.js"></script>
<script src="scripts/pagination/jPages.js"></script>


<title>漂书系统</title>
<link rel="stylesheet" href="styles/searchlayout.css" type="text/css" />
<script type="text/javascript">
var xmlhttp;
var oldtext="";
function callback(){
	if (xmlhttp.readyState==4 && xmlhttp.status==200){
		document.getElementById("dropdownmenu").innerHTML=xmlhttp.responseText;
	}
}

function searchBook(){
	var y=document.getElementById("keyword");
	if(y.value!=oldtext){
		oldtext=y.value;
		if(y.value!=""){
			if (window.XMLHttpRequest)
			{
				xmlhttp=new XMLHttpRequest();
			}
			else
			{
				xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
			}
			xmlhttp.open("GET","checkbook.do?q="+encodeURI(encodeURI(y.value)),true);
			xmlhttp.onreadystatechange=callback;
			xmlhttp.send(null);
		}
	}
}

function submitForm() {
	document.getElementById("searchform").submit()
}
</script>
</head>

<body>
	<!-- 登录部分 -->
	<div class="wrapper col0">
		<div id="topbar">
			<div id="slidepanel">
				<div class="topbox"></div>
				<div class="topbox last">
					<h2>登录面板</h2>
					<form action="#" method="post">
						<fieldset>
							<legend>Login Form</legend>
							<label for="username">用户名: <input type="text"
								name="username" id="username" value="" />
							</label> <label for="password">密码: <input type="password"
								name="password" id="password" value="" />
							</label> <label for="remember"> <input class="checkbox"
								type="checkbox" name="remember" id="remember" checked="checked" />
								记住登录信息
							</label> <input type="submit" name="login" id="login" value="登录" />
							&nbsp; <input type="reset" name="reset" id="reset" value="重置" />
							</p>
						</fieldset>
					</form>
				</div>
				<br class="clear" />
			</div>
			<div id="loginpanel">
				<ul>
					<li class="left">登录面板 &raquo;</li>
					<li class="right" id="toggle"><a id="slideit"
						href="#slidepanel">打开面板</a><a id="closeit" style="display: none;"
						href="#slidepanel">关闭面板</a></li>
				</ul>
			</div>
			<br class="clear" />
		</div>
	</div>
	<!--
########################################################################################## -->
	<div class="wrapper col1">
		<div id="header">
			<div id="logo">
				<a href="#"><img id="logoimg" src="images/logo_slat.jpg" /></a>
				<!--<p>漂书系统</p>-->
			</div>
			<div id="topnav">
				<ul>
					<li><a href="driftAfterLogin.jsp">首页</a></li>
					<li><a href="BreifAction">漂书</a></li>
					<li class="active"><a href="search.jsp">搜索</a></li>
					<li class="last"><a href="donate.jsp">捐书</a></li>
				</ul>
			</div>
			<br class="clear" />
		</div>
	</div>
	<!--
########################################################################################## -->
	<div class="wrapper col2"></div>
	<div class="search_engine">
		<div class="component1">
			<form method="post" action="SearchAction" id="searchform">
				<span id="label">请输入关键字：</span> <input id="keyword" type="text"
					name="nameorisbn" onkeyup="searchBook()"></input>
				<!--<input type="submit" value="搜索"></input>-->
				<a href="javascript:submitForm()" class="a-btn"> <span
					class="a-btn-text"><img src="images/search.png" /></span> <span
					class="a-btn-slide-text">搜索</span> <span class="a-btn-icon-right"><img
						src="images/arrow_right.png" /></span>
				</a>
			</form>
			<div id="dropdownmenu"></div>
		</div>
		<!-- navigation holder -->
		<div class="holder"></div>
		<div id="itemContainer">
			<s:iterator value="result">
				<div class="component">
					<div class="bookimg">
						<img src="<s:property value='cover' />">
					</div>
					<div class="bookintru">
						<ul>
							<li>书名：<s:property value="bookname" /></li>
							<li>ISBN：<s:property value="ISBN"></s:property></li>
							<li>作者：<s:property value="author"></s:property></li>
							<li>出版社：<s:property value="publisher"></s:property></li>
							<li>简介：
								<p>
									<s:property value="about"></s:property>
								</p>
							</li>
							<li><a id="<s:property value='ISBN'/>"
								href='bookdetail?isbn=<s:property value='ISBN'/>' class="btn">我要漂~</a></li>
						</ul>
					</div>
				</div>
			</s:iterator>
		</div>
		<br class="clear" />
		<!-- navigation holder -->
		<div class="holder"></div>
	</div>
	<br />
	<br />
	<!--
########################################################################################## -->
	<div class="wrapper col5">
		<div id="copyright">
			<p class="fl_left">
				Copyright &copy; 2012 - All Rights Reserved - <a href="#">Shanghai
					University Opensource Community</a>
			</p>
			<br class="clear" />
		</div>
	</div>

	<script> 
/* when document is ready , start Pagination*/
$(function() {

    /* initiate plugin */
    $("div.holder").jPages({
        containerID: "itemContainer"
    });

});
</script>
</body>
</html>